﻿<style>
    .favCheckBox input
    {
        display: none;
    }

    .favCheckBox span
    {
        width: 27px;
        height: 27px;
        display: block;
        background-image: url("../Content/Image/EmptyHeart.jpg");
        background-size: 27px;
        background-repeat: no-repeat;
        margin-left: auto;
        margin-right: auto;
        display: inline-block;
    }

    .favCheckBox input:checked + span
    {
        background-image: url("../Content/Image/heart.jpg");
        background-size: 27px;
        background-repeat: no-repeat;
        margin-left: auto;
        margin-right: auto;
        display: inline-block;
    }

    .cartCheckBox input
    {
        display: none;
    }

    .cartCheckBox span
    {
        width: 27px;
        height: 27px;
        display: block;
        background-image: url("../Content/Image/blackCart.jpg");
        background-size: 27px;
        background-repeat: no-repeat;
        margin-left: auto;
        margin-right: auto;
        display: inline-block;
    }

    .cartCheckBox input:checked + span
    {
        background-image: url("../Content/Image/redCart.jpg");
        background-size: 27px;
        background-repeat: no-repeat;
        margin-left: auto;
        margin-right: auto;
        display: inline-block;
    }
</style>